{{ template "common/head.html" .title}}
<body>
{{ template "common/header.html" .userName }}

{{ template "common/search.html"}}

<div class="total_count">全部商品<em>2</em>件</div>
<ul class="cart_list_th clearfix">
    <li class="col01">商品名称</li>
    <li class="col02">商品单位</li>
    <li class="col03">商品价格</li>
    <li class="col04">数量</li>
    <li class="col05">小计</li>
    <li class="col06">操作</li>
</ul>
<form action="/u/order" method="post">
    {{ range .goodsSKUs }}
        <ul class="cart_list_td clearfix">
            <li class="col01"><input type="checkbox" name="goods_sku_id" checked value="{{ .goodsSKU.Id }}"></li>
            <li class="col02"><img src="http://192.168.181.130:8888/{{ .goodsSKU.Image }}"></li>
            <li class="col03">{{ .goodsSKU.Name }}<br><em>{{ .goodsSKU.Price }}元/{{ .goodsSKU.Unite }}</em></li>
            <li class="col04">{{ .goodsSKU.Unite }}</li>
            <li class="col05">{{ .goodsSKU.Price }}元</li>
            <li class="col06">
                <div class="num_add">
                    <a href="javascript:;" class="add fl">+</a>
                    <input type="text" class="num_show fl" goods_sku_id="{{ .goodsSKU.Id }}" value="{{ .goodsCount }}">
                    <a href="javascript:;" class="minus fl">-</a>
                </div>
            </li>
            <li class="col07">{{ .goodsTotalPrice }}元</li>
            <li class="col08"><a href="javascript:;" class="delete_cart_goods" goods_sku_id="{{ .goodsSKU.Id }}">删除</a>
            </li>
        </ul>
    {{ end }}

    <ul class="settlements">
        <li class="col01"><input type="checkbox" name="" checked=""></li>
        <li class="col02">全选</li>
        <li class="col03">合计(不含运费)：<span>¥</span><em>{{ .allGoodsPrice }}</em><br>共计<b>{{ .allGoodsCount }}</b>件商品</li>
        <li class="col04"><input type="submit" value="去结算"></li>
    </ul>

</form>


{{ template "common/footer.html"}}
<script type="text/javascript" src="/static/js/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="/static/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="/static/js/slide.js"></script>
<script type="text/javascript">
    // 更新购物总价格 总件数
    function UpdateCartGoodsPrice() {
        total_price = 0;
        total_count = 0;
        $('.cart_list_td').find(':checked').parents('ul').each(function () {
            goods_count = parseInt($(this).find('.num_show').val());
            goods_price = parseFloat($(this).children('.col07').text());

            total_price += goods_price;
            total_count += goods_count;
        })
        $('.settlements').children('.col03').children('em').text(total_price)
        $('.settlements').children('.col03').children('b').text(total_count)
    }

    // 设置 全选 与 全不选
    $('.settlements').find(':checkbox').change(function () {
        is_checked = $(this).prop('checked');
        $('.cart_list_td').find(':checkbox').each(function () {
            $(this).prop('checked', is_checked)
        })
        UpdateCartGoodsPrice();
    })

    // 根据商品的选中状态 改变全选状态
    $('.cart_list_td').find(':checkbox').change(function () {
        checkbox_length = $('.cart_list_td').find(':checkbox').length
        checked_length = $('.cart_list_td').find(':checked').length

        if (checkbox_length > checked_length) {
            $('.settlements').find(':checkbox').prop('checked', "")
        } else {
            $('.settlements').find(':checkbox').prop('checked', "checked")
        }
        UpdateCartGoodsPrice();
    })

    // 添加商品数量
    $('.add').click(function () {
        goods_count = parseInt($(this).next().val())
        goods_count += 1

        goods_sku_id = $(this).next().attr('goods_sku_id')
        param = {"goods_sku_id": goods_sku_id, "goods_count": goods_count}
        $.ajaxSettings.async = false
        $.post("/u/update-cart", param, function (data) {
            if (data.code == 0) {
                err_update = false
            } else {
                alert(data.msg);
                err_update = true
            }
        })
        $.ajaxSettings.async = true
        if (!err_update) {
            $(this).next().val(goods_count)
            // 计算小计
            goods_price = parseFloat($(this).parents('ul').children('.col05').text())
            $(this).parents('ul').children('.col07').text((goods_price * goods_count).toFixed(2) + '元')
        }
        is_checked = $(this).parents('ul').find(':checkbox').prop('checked')
        if (is_checked) {
            UpdateCartGoodsPrice()
        }
    });

    // 减少商品数量
    $('.minus').click(function () {
        goods_count = parseInt($(this).prev().val())
        goods_count -= 1
        if (1 > goods_count) {
            goods_count = 1
            $(this).prev().val(goods_count)
            return
        }

        goods_sku_id = $(this).prev().attr('goods_sku_id')
        param = {"goods_sku_id": goods_sku_id, "goods_count": goods_count}
        $.ajaxSettings.async = false
        $.post("/u/update-cart", param, function (data) {
            if (data.code == 0) {
                err_update = false
            } else {
                err_update = true
                alert(data.msg)
            }
        })
        $.ajaxSettings.async = true
        if (!err_update) {
            $(this).prev().val(goods_count)
            // 计算小计
            goods_price = parseFloat($(this).parents('ul').children('.col05').text())  // 商品单价

            $(this).parents('ul').children('.col07').text((goods_price * goods_count).toFixed(2) + '元')
        }
        is_checked = $(this).parents('ul').find(':checkbox').prop('checked')
        if (is_checked) {
            UpdateCartGoodsPrice()
        }
    })

    // 手动输入商品数量
    pre_count = 0

    $('.num_show').focus(function () {
        pre_count = $(this).val()
    })

    $('.num_show').blur(function () {
        goods_count = $(this).val()
        if (isNaN(goods_count) || goods_count.trim().length == 0 || parseInt(goods_count) < 0) {
            goods_count = pre_count
            $(this).val(goods_count)
            return
        }
        goods_sku_id = $(this).attr('goods_sku_id')
        goods_count = parseInt(goods_count)
        param = {'goods_sku_id': goods_sku_id, "goods_count": goods_count}

        $.ajaxSettings.async = false
        $.post('/u/update-cart', param, function (data) {
            if (data.code == 0) {
                err_update = false
            } else {
                err_update = true
            }
        })
        $.ajaxSettings.async = true
        if (!err_update) {
            $(this).val(goods_count)
            // 计算小计
            goods_price = parseFloat($(this).parents('ul').children('.col05').text())
            $(this).parents('ul').children('.col07').text((goods_price * goods_count).toFixed(2) + '元')
        }

        is_checked = $(this).parents('ul').find(':checked').prop('checked')
        if (is_checked) {
            UpdateCartGoodsPrice()
        }
    })
    // 删除商品
    $('.delete_cart_goods').click(function () {
        goods_sku_id = $(this).attr('goods_sku_id')
        param = {"goods_sku_id": goods_sku_id}

        $.ajaxSettings.async = false
        $.post('/u/delete-cart', param, function (data) {
            if (data.code == 0) {
                err_update = false
            } else {
                err_update = true
            }
        })
        $.ajaxSettings.async = true
        // 在视图中删除商品
        if (!err_update) {
            $(this).parents('ul').remove()
        }

        // 更新总价
        is_checked = $(this).parents('ul').find(":checkbox").prop("checked")
        if (is_checked) {
            UpdateCartGoodsPrice()
        }
    })


</script>
</body>
</html>